<template>
  <div
    class="nbox1"
    style="
      display: flex;
      min-height: 3000px;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 12px;
      justify-content: space-around;
    "
  >
    <div class="nbox2" v-for="(item, key) in dt.list">
      <span>排名 {{ key + 1 }} / 次数 {{ item.newso }}</span>
      <div class="pvp44_rank_list_avabox">
        <img class="ava" :src="$cfg.function.ava(item2)" v-for="item2 in item.icon" />
      </div>
      <div class="pvp44_rank_list_pa" @click="ct.sowork(item)">
        <n-button size="small">搜索</n-button>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    val: {
      required: true,
    },
    ct: {
      required: true,
    },
    cfg: {
      required: true,
    },
  },
  setup(props) {
    //传递
    let { val, ct, cfg } = props;

    //初始化
    val.rankarr = {};
    let dt = val.rankarr;

    //获取排名数据
    ct.get_ranklist = async () => {
      const res = await cfg.axios.get(`${cfg.url}`, {
        params: {
          t: "get/work/get_pvp44rank",
        },
      });
      dt.list = res.data.data;
    };

    //搜索排名作业
    ct.sowork = async (item) => {
      val.type = "index";
      val.team = [];
      item.icon.forEach((element) => {
        const ico = element;
        // 使用 find 找到图标对象
        let foundRole = cfg.role.find((role) => role.icon === ico);
        val.team.push(foundRole);
      });

      await ct.upteam();
      await ct.search_work();

      //val.team_icon = item.icon;

      ct.upteam();
    };

    onMounted(async () => {
      await ct.get_ranklist();
    });

    return {
      dt,
    };
  },
};
</script>
